<template>
    <div>
        <div class="crumbs">
            <div class="contentbox">
                <div class="contentsize">租金管理(交款)</div>
                <div>
                    <el-button @click="cacelsubmitForm('ruleForm')">返回</el-button>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="addtitle">房屋信息</div>
            <!-- <div class="detailcontent">
                <div class="detailitem1">{{ buildvalue.fwdz }}</div>
                <div class="detailitem">管房单位：{{ buildvalue.gfdw }}</div>
                <div class="detailitem">档案编号：{{ buildvalue.dabh }}</div>
                <div class="detailitem">房屋性质：{{ buildvalue.fwyt }}</div>
                <div class="detailitem">房屋结构：{{ buildvalue.fwjg }}</div>
                <div class="detailitem">产权单位：{{ buildvalue.cqdw }}</div>
                <div class="detailitem">建筑面积：{{ buildvalue.jzmj }}</div>
                <div class="detailitem">建筑年代：{{ buildvalue.jznd }}</div>
                <div class="detailitem">建筑形式：{{ buildvalue.jzxs }}</div>
                <div class="detailitem"></div>
            </div> -->
            <el-descriptions
                :column="3"
                border
                size="medium"
                :labelStyle="rowCenter"
                :contentStyle="contentCenter"
                v-for="(item, index) in buildvalue"
                :key="index"
            >
                <el-descriptions-item label="房屋地址：">{{ item.fwdz }}</el-descriptions-item>
                <!-- <el-descriptions-item label="管房单位：">{{ item.gfdw }}</el-descriptions-item> -->
                <el-descriptions-item label="档案编号：">{{ item.dabh }}</el-descriptions-item>
                <el-descriptions-item label="房屋性质：">{{ item.fwyt }}</el-descriptions-item>
                <!-- <el-descriptions-item label="管房单位：">{{ item.gfdw }}</el-descriptions-item> -->
                <!-- <el-descriptions-item label="房屋结构：">{{ item.fwjg }}</el-descriptions-item> -->
                <el-descriptions-item label="产权单位：">{{ item.cqdw }}</el-descriptions-item>
                <el-descriptions-item label="建筑面积：">{{ item.jzmj }}</el-descriptions-item>
                <!-- <el-descriptions-item label="建筑年代：">{{ item.jznd }}</el-descriptions-item> -->
                <el-descriptions-item label="管理方式：">{{ item.glfs }}</el-descriptions-item>
                <el-descriptions-item label="产别：">{{ item.cb }}</el-descriptions-item>
                <!-- <el-descriptions-item label="建筑形式：">{{ item.jzxs }}</el-descriptions-item> -->
                <el-descriptions-item></el-descriptions-item>
            </el-descriptions>
            <div class="addtitle" style="margin-top: 10px">租户信息</div>
            <!-- <div class="detailcontent">
                <div class="detailitem">承租人：{{ form.czr }}</div>
                <div class="detailitem">承租人联系方式：{{ form.czrlxfs }}</div>
                <div class="detailitem">证件名称：{{ form.zjmc }}</div>
                <div class="detailitem">证件号码：{{ form.zjhm }}</div>
                <div class="detailitem">联系地址：{{ form.lxdz }}</div>
                <div class="detailitem"></div>
            </div> -->
            <el-descriptions :column="3" border size="medium" :labelStyle="rowCenter" :contentStyle="contentCenter">
                <el-descriptions-item label="承租人：">{{ form.czr }}</el-descriptions-item>
                <el-descriptions-item label="承租人联系方式：">{{ form.czrlxfs }}</el-descriptions-item>
                <el-descriptions-item label="证件名称：">{{ form.zjmc }}</el-descriptions-item>
                <el-descriptions-item label="证件号码：">{{ form.zjhm }}</el-descriptions-item>
                <el-descriptions-item label="联系地址：">{{ form.lxdz }}</el-descriptions-item>
                <el-descriptions-item></el-descriptions-item>
            </el-descriptions>
            <div class="addtitle" style="margin-top: 10px">合同信息</div>
            <!-- <div class="detailcontent">
                <div class="detailitem">合同编号：{{ form.htbh }}</div>
                <div class="detailitem">合同签订日期：{{ form.qdsj ? form.qdsj.split(' ')[0] : '' }}</div>
                <div class="detailitem">出租面积：{{ form.czmj }}</div>
                <div class="detailitem">合同起始日期：{{ form.zlqssj ? form.zlqssj.split(' ')[0] : '' }}</div>
                <div class="detailitem">合同终止日期：{{ form.zldqsj ? form.zldqsj.split(' ')[0] : '' }}</div>
                <div class="detailitem">合同金额：{{ form.htje }}</div>
                <div class="detailitem">减免金额：{{ form.jmje }}</div>
                <div class="detailitem">减免原因：{{ form.jmyy }}</div>
                <div class="detailitem">设备清单：{{ form.sbqd }}</div>
                <div class="detailitem">预收金额：{{ bjdetail.ysje }}</div>
                <div class="detailitem">当欠金额：{{ bjdetail.dqje }}</div>
                <div class="detailitem"></div>
            </div> -->
            <el-descriptions :column="3" border size="medium" :labelStyle="rowCenter" :contentStyle="contentCenter">
                <el-descriptions-item label="合同编号：">{{ form.htbh }}</el-descriptions-item>
                <el-descriptions-item label="合同签订日期：">{{ form.qdsj ? form.qdsj.split(' ')[0] : '' }}</el-descriptions-item>
                <el-descriptions-item label="出租面积：">{{ form.czmj }}</el-descriptions-item>
                <el-descriptions-item label="合同起始日期：">{{ form.zlqssj ? form.zlqssj.split(' ')[0] : '' }}</el-descriptions-item>
                <el-descriptions-item label="合同终止日期：">{{ form.zldqsj ? form.zldqsj.split(' ')[0] : '' }}</el-descriptions-item>
                <el-descriptions-item label="合同金额：" v-if="type=='2'">{{ form.htje }}</el-descriptions-item>
                <el-descriptions-item label="月租金：" v-if="type=='1'">{{ form.zjdj }}</el-descriptions-item>
                <el-descriptions-item label="减免金额：">{{ form.jmje }}</el-descriptions-item>
                <el-descriptions-item label="减免原因：">{{ form.jmyy }}</el-descriptions-item>
                <el-descriptions-item label="设备清单：">{{ form.sbqd }}</el-descriptions-item>
                <el-descriptions-item label="预收金额：">{{ bjdetail.ysje }}</el-descriptions-item>
                <el-descriptions-item label="当欠金额：">{{ bjdetail.dqje }}</el-descriptions-item>
                <el-descriptions-item label="已缴押金金额：">{{ bjdetail.yjyjje }}</el-descriptions-item>
                <el-descriptions-item label="押金：">{{ form.yj }}</el-descriptions-item>
                <el-descriptions-item label="押金收缴日期：">{{ form.yjrq ? form.yjrq.substring(0, 7) : '' }}</el-descriptions-item>
            </el-descriptions>
            <div class="addtitle" style="margin-top: 10px">{{ jkshowname }}信息</div>
            <div class="detailcontent">
                <el-form
                    :inline="true"
                    :model="projectdetail"
                    class="demo-form-inline"
                    label-position="right"
                    size="small"
                    label-width="140px"
                >
                    <el-form-item label="交返款：" style="width: 32%">
                        <div style="width: 220px">
                            <el-select
                                v-model="projectdetail.jfk"
                                placeholder="请选择交返款"
                                @change="getjfkvalue($event)"
                                style="width: 100%"
                            >
                                <el-option v-for="item in jfklist" :key="item.code" :label="item.name" :value="item.code"> </el-option>
                            </el-select>
                        </div>
                    </el-form-item>
                    <el-form-item label="是否上报财务：" style="width: 32%">
                        <div style="width: 220px">
                            <el-select v-model="projectdetail.sfbcw" placeholder="请选择是否上报财务" style="width: 100%">
                                <el-option v-for="item in sflist" :key="item.code" :label="item.name" :value="item.code"> </el-option>
                            </el-select>
                        </div>
                    </el-form-item>
                    <el-form-item label="税前金额：" style="width: 32%" v-if="jksjow">
                        <div style="width: 220px">
                            <el-input
                                v-model="projectdetail.sqje"
                                placeholder="请输入税前金额"
                                class="search-input"
                                @blur="getseval"
                                style="width: 100%"
                            >
                            </el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="退押金金额：" style="width: 32%" v-if="!jksjow">
                        <div style="width: 220px">
                            <el-input v-model="projectdetail.jyjje" placeholder="请输入退押金金额" class="search-input" style="width: 100%">
                            </el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="退租金金额：" style="width: 32%" v-if="!jksjow">
                        <div style="width: 220px">
                            <el-input v-model="projectdetail.tkje" placeholder="请输入退租金金额" class="search-input" style="width: 100%">
                            </el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="税额(9%)：" style="width: 32%" v-if="jksjow">
                        <div style="width: 220px">
                            <el-input
                                v-model="projectdetail.she"
                                placeholder="请输入税额"
                                class="search-input"
                                style="width: 100%"
                            ></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="税后金额：" style="width: 32%" v-if="jksjow">
                        <div style="width: 220px">
                            <el-input
                                v-model="projectdetail.shje"
                                placeholder="请输入税后金额"
                                class="search-input"
                                style="width: 100%"
                            ></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item :label="jksjow ? '收租方式：' : '返款方式：'" style="width: 32%">
                        <div style="width: 220px">
                            <el-select v-model="projectdetail.zjlb" placeholder="请选择收租方式" style="width: 100%">
                                <el-option v-for="item in jzlblist" :key="item.code" :label="item.name" :value="item.code"> </el-option>
                            </el-select>
                        </div>
                    </el-form-item>
                    <el-form-item label="支票号：" style="width: 32%">
                        <div style="width: 220px">
                            <el-input
                                v-model="projectdetail.zph"
                                placeholder="请输入支票号："
                                class="search-input"
                                style="width: 100%"
                            ></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="日期：" style="width: 32%">
                        <el-date-picker
                            type="date"
                            placeholder="选择日期"
                            v-model="projectdetail.jkrq"
                            value-format="yyyy-MM-dd"
                        ></el-date-picker>
                    </el-form-item>

                    <el-form-item label="备注：" style="width: 100%">
                        <el-input
                            type="textarea"
                            :autosize="{ minRows: 4 }"
                            placeholder="请输入备注"
                            v-model="projectdetail.bz"
                            style="width: 900px"
                        >
                        </el-input>
                    </el-form-item>
                </el-form>
            </div>
            <div class="addtitle" v-if="jksjow">补缴信息</div>
            <div class="detailcontent" v-if="jksjow">
                <el-form :inline="true" :model="bjdetail" class="demo-form-inline" label-position="right" size="small" label-width="140px">
                    <el-form-item label="旧欠金额：" style="width: 32%">
                        <div style="width: 220px">
                            {{ bjdetail.jqje }}
                        </div>
                    </el-form-item>
                    <el-form-item label="本次补缴旧欠金额：" style="width: 32%">
                        <div style="width: 220px">
                            <el-input
                                v-model="tjdetail.bjqje"
                                placeholder="请输入本次补缴旧欠金额"
                                class="search-input"
                                style="width: 100%"
                                @change="bjqpd"
                            ></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item style="width: 32%"></el-form-item>
                    <el-form-item label="已缴其他金额：" style="width: 32%">
                        <div style="width: 220px">
                            {{ bjdetail.yjqtje }}
                        </div>
                    </el-form-item>
                    <el-form-item label="缴其他金额：" style="width: 32%">
                        <div style="width: 220px">
                            <el-input
                                v-model="tjdetail.jqtje"
                                placeholder="请输入缴其他金额："
                                class="search-input"
                                style="width: 100%"
                            ></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item style="width: 32%"></el-form-item>
                    <el-form-item label="未缴押金金额：" style="width: 32%">
                        <div style="width: 220px">
                            {{ bjdetail.wjyjje }}
                        </div>
                    </el-form-item>
                    <el-form-item label="缴押金金额：" style="width: 32%">
                        <div style="width: 220px">
                            <el-input
                                v-model="tjdetail.jyjje"
                                placeholder="请输入缴押金金额"
                                class="search-input"
                                style="width: 100%"
                            ></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item style="width: 32%"></el-form-item>
                    <el-form-item style="width: 32%" v-if="type == '1'" label="缴增收金额：">
                        <div style="width: 220px">
                            {{ bjdetail.zsje }}
                        </div>
                    </el-form-item>
                    <el-form-item label="增收金额：" style="width: 32%" v-if="type == '1'">
                        <div style="width: 220px">
                            <el-input
                                v-model="tjdetail.zsje"
                                placeholder="请输入增收金额"
                                class="search-input"
                                style="width: 100%"
                            ></el-input>
                        </div>
                    </el-form-item>
                </el-form>
            </div>
            <div class="addtitle" v-if="jksjow">缴费信息</div>
            <div>
                <div style="overflow: hidden" v-if="jksjow">
                    <el-table
                        :data="tableData"
                        border
                        :header-cell-style="{
                            background: '#f8fbff',
                            color: '#173686',
                            border: '0'
                        }"
                        style="width: 100%"
                        size="mini"
                        :row-style="{ height: '20px' }"
                        :cell-style="{ padding: '0px' }"
                    >
                        <el-table-column prop="year" label="年份" align="center"> </el-table-column>
                        <el-table-column prop="month" label="月份" align="center"> </el-table-column>
                        <el-table-column label="月应缴金额" align="center" prop="yyjje"></el-table-column>
                        <el-table-column label="减免金额" align="center" prop="jmje"></el-table-column>
                        <el-table-column label="待缴金额" align="center" prop="yjje"></el-table-column>
                        <el-table-column label="已收取金额" align="center" prop="ysqje"></el-table-column>
                        <el-table-column label="交款金额" align="center" prop="jkje">
                            <template slot-scope="scope">
                                <div class="noBor">
                                    <span v-if="scope.row.yjje == 0">--</span>
                                    <el-input v-model="scope.row.jkje" placeholder="请输入交款金额" v-else></el-input>
                                </div>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-button
                        type="primary"
                        @click="gettime(projectdetail.sqje, form.yzj, tjdetail.bjqje, tjdetail.jqtje, tjdetail.jyjje, tjdetail.zsje)"
                        style="float: right; margin-top: 14px"
                        >按年月分配交款金额</el-button
                    >
                </div>
                <div style="margin: 14px auto; width: 300px">
                    <!-- :disabled="showtj" -->
                    <el-button type="primary" @click="submittwojk" v-if="jksjow">保存</el-button>
                    <el-button type="primary" @click="submittwojk1" v-if="!jksjow">保存</el-button>
                    <el-button type="primary" @click="yzysubmit" v-if="jksjow">预转已</el-button>
                    <el-button type="primary" @click="addzs = true" v-if="type == '1'">增收转入</el-button>
                    <el-button @click="cacelsubmitForm('ruleForm')">返回</el-button>
                </div>
                <div class="addtitle">过往缴费记录</div>
                <el-table :data="jftabledata" style="width: 100%" :header-cell-style="tableHeaderColor" :row-style="tablerowColor" border>
                    <el-table-column prop="jkrq" label="交款日期" align="center" fixed>
                        <template slot-scope="scope">
                            <div class="noBor">
                                {{ scope.row.jkrq ? scope.row.jkrq.split(' ')[0] : '' }}
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column prop="sqje" label="实收金额" align="center"> </el-table-column>
                    <el-table-column prop="she" label="扣税(9%)" align="center"> </el-table-column>
                    <el-table-column prop="shje" label="实收金额(税后)" align="center" width="120"> </el-table-column>
                    <el-table-column prop="ysqje" label="已收金额" align="center"> </el-table-column>
                    <el-table-column prop="ysje" label="预收金额" align="center"> </el-table-column>
                    <el-table-column prop="yzyje" label="预转已金额" align="center"> </el-table-column>
                    <el-table-column prop="bjqje" label="补旧欠金额" align="center"> </el-table-column>
                    <el-table-column prop="jqtje" label="缴其他金额" align="center"> </el-table-column>
                    <el-table-column prop="jyjje" label="缴（退）押金金额" align="center" width="140"> </el-table-column>
                    <el-table-column prop="zsje" label="缴增收金额" align="center" width="120"> </el-table-column>
                    <el-table-column prop="tkje" label="退款金额" align="center"> </el-table-column>
                    <el-table-column prop="bz" label="备注" align="center" :show-overflow-tooltip="true"> </el-table-column>
                </el-table>
                <!-- <div class="pagination" style="float: right">
                    <el-pagination background layout="total,prev, pager, next,jumper" :total="total" :current-page.sync="current"
                        :page-size="pageSize" @current-change="handleCurrentChange">
                    </el-pagination>
                </div> -->
            </div>
            <el-dialog title="合同列表" :visible.sync="addzs" :modal-append-to-body="false" width="80%">
                <div style="overflow: hidden">
                    <el-form ref="fwform" :model="fwform" label-width="80px" :inline="true" size="mini">
                        <el-form-item label="承租人:">
                            <div style="width: 150px">
                                <el-input v-model="fwform.czr" placeholder="请输入承租人"></el-input>
                            </div>
                        </el-form-item>
                        <el-form-item label="房屋地址:">
                            <div style="width: 150px">
                                <el-input v-model="fwform.fwdz" placeholder="请输入房屋地址"></el-input>
                            </div>
                        </el-form-item>
                        <el-form-item label="档案编号:">
                            <div style="width: 150px">
                                <el-input v-model="fwform.dabh" placeholder="请输入档案编号"></el-input>
                            </div>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="onSearch" icon="el-icon-search">查询</el-button>
                            <el-button @click="reSearch" icon="el-icon-refresh">重置</el-button>
                        </el-form-item>
                    </el-form>
                    <el-table
                        :data="zstableData"
                        style="width: 100%"
                        :header-cell-style="tableHeaderColor"
                        :row-style="tablerowColor"
                        border
                    >
                        <el-table-column prop="htbh" label="合同编号" align="center" fixed width="160"> </el-table-column>
                        <el-table-column prop="dabh" label="档案编号" align="center" width="240" :show-overflow-tooltip="true">
                        </el-table-column>
                        <el-table-column prop="fwdz" label="房屋地址" align="center" width="280" :show-overflow-tooltip="true">
                        </el-table-column>
                        <el-table-column prop="czr" label="承租单位" align="center" width="280"> </el-table-column>
                        <el-table-column prop="zjdj" label="月租金" align="center"> </el-table-column>
                        <el-table-column prop="zsje" label="增收金额" align="center"> </el-table-column>
                        <el-table-column prop="qdsj" label="签订时间" align="center" width="120">
                            <template slot-scope="scope">
                                {{ scope.row.qdsj ? scope.row.qdsj.split(' ')[0] : '' }}
                            </template>
                        </el-table-column>
                        <el-table-column prop="zlqssj" label="起租时间" align="center" width="120">
                            <template slot-scope="scope">
                                {{ scope.row.zlqssj ? scope.row.zlqssj.split(' ')[0] : '' }}
                            </template>
                        </el-table-column>
                        <el-table-column prop="zldqsj" label="到期时间" align="center" width="120">
                            <template slot-scope="scope">
                                {{ scope.row.zldqsj ? scope.row.zldqsj.split(' ')[0] : '' }}
                            </template>
                        </el-table-column>
                        <el-table-column fixed="right" label="操作" align="center" width="120px">
                            <template slot-scope="scope">
                                <el-button type="text" @click="getzsClick(scope.row.id)">选择</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <div class="pagination" style="float: right">
                        <el-pagination
                            background
                            layout="total,sizes,prev, pager, next,jumper"
                            :total="total"
                            :current-page.sync="current"
                            :page-size="pageSize"
                            @current-change="handleCurrentChange"
                            :page-sizes="[10, 20, 30, 40, 50, 100]"
                            @size-change="handleSizeChange"
                        >
                        </el-pagination>
                    </div>
                </div>
            </el-dialog>
        </div>
    </div>
</template>
<script>
import {
    updatezzy,
    getzssignlist,
    builddetail,
    signlistdetail,
    jfzjlist,
    jfxzadd,
    jflist,
    xzzjupdate,
    updatezjjfinfo,
    yzyinfo,
    getjfxq
} from '@/api/index';
import global from '@/components/common/httpurl.vue';
import valueList from '@/components/common/valueList.vue';
export default {
    name: 'zjgladd',
    data() {
        return {
            type: this.$store.getters.type,
            addzs: false,
            jkshowname: '交款',
            contentCenter: {
                'min-width': '230px', //最小宽度
                'word-break': 'break-all' //过长时自动换行
            },
            rowCenter: {
                'text-align': 'right',
                width: '230px'
            },
            sbqd: [], //设备清单
            showtj: true,
            total: 0,
            current: 1,
            pageSize: 10,
            jksjow: true, //交款内容
            tableData: [], //缴费信息
            jftabledata: [], //过往缴费记录
            newtable: [], //计算过后的新数组
            httpUrl: global.httpUrl, //公共地址
            jfklist: valueList.jfklist, //交返款
            jkfslist: valueList.jkfslist, //交款方式
            jzlblist: valueList.jzlblist, //收租方式
            // sflist: valueList.sflist,//是否
            sflist: [
                { name: '是', code: '1' },
                { name: '否', code: '2' }
            ],
            filefileList: [], //文件列表
            fileListshandle: [],
            // 请求表头信息
            myHeaders: {
                token: localStorage.getItem('token')
            },
            form: {
                create_name: '',
                create_name_id: '',
                create_time: '',
                current: 0,
                fcbl: '',
                fj: '',
                glfs: '',
                id: '',
                note: '',
                pageSize: 0,
                qsrq: '',
                relid: '',
                status_code: 1,
                stgldw: '',
                type: '',
                update_name: '',
                update_name_id: '',
                update_time: '',
                wtdw: '',
                zzrq: ''
            },
            fileList: [],
            fromlist: [],
            projectdetail: {
                jfk: '1', //交返款 1：交款 2：返款 ,
                she: 0, //税额
                shje: 0, //税后金额
                sqje: 0, //税前金额
                zjlb: '', //收租方式
                zph: '', //支票号
                jkrq: '', //交款日期
                bz: '', //备注
                status_code: 1,
                sfbcw: '1', //是否上报财务
                jyjje: 0, //缴押金金额
                tkje: 0, //退款金额
                zjList: []
            },
            buildvalue: {},
            // 缴费信息
            jfform: {
                bz: '', // 备注 ,
                create_name: '', //创建人 ,
                create_name_id: '', // 创建人id ,
                create_time: '', //创建时间 ,
                current: 0, //第几页 ,
                id: '', // id ,
                jfk: '1', //交返款 1：交款 2：返款 ,
                jkrq: '', //交款日期 ,
                pageSize: 10, //每页数量 ,
                she: '', //税额 ,
                shje: '', //税后金额 ,
                signid: '', //合同ID ,
                sqje: '', //税前金额 ,
                status_code: '1', //1正常 2删除 ,
                update_name: '', //修改人 ,
                update_name_id: '', //修改人id ,
                update_time: '', //修改时间 ,
                zjlb: '', //收租方式 ,
                zph: '' //支票号
            },
            // 缴费列表表单
            jflistform: {
                bz: '', //备注 ,
                create_name: '', //创建人 ,
                create_name_id: '', //创建人id ,
                create_time: '', //创建时间 ,
                current: 1, //第几页 ,
                id: '', //id ,
                jfk: '1', //交返款 1：交款 2：返款 ,
                jkrq: '', //交款日期 ,
                pageSize: 10, //每页数量 ,
                she: '', //税额 ,
                shje: '', //税后金额 ,
                signid: '', //合同ID ,
                sqje: '', //税前金额 ,
                status_code: '1', //1正常 2删除 ,
                update_name: '', //修改人 ,
                update_name_id: '', //修改人id ,
                update_time: '', //修改时间 ,
                zjlb: '', //收租方式 ,
                zph: '' //支票号
            },
            signid: '',
            bjdetail: {},
            tjdetail: {
                bjqje: 0,
                jqtje: 0,
                jyjje: 0,
                zsje: 0
            },
            zstableData: [],
            fwform: {
                create_name: '', // 创建人 ,
                create_name_id: '', // 创建人id ,
                create_time: '', // 创建时间 ,
                current: 1, //第几页,
                czdz: '', //出租地址 ,
                czmj: '', //出租面积 ,
                czr: '', //承租人 ,
                czrlxfs: '', //承租人联系方式 ,
                dabh: '', //档案编号 ,
                db: '', //电表 ,
                fgy: '', //房管员 ,
                fj: '', //附件 ,
                fwdz: '', //房屋地址 ,
                glfs: '', //管理方式 出租经营 委托管理 ,
                htbh: '', //合同编号 ,
                htdqsj: '', //合同到期时间（签订时约定时间） ,
                htje: '', //合同金额 ,
                htzzsj: '', //合同中止时间 ,
                htzzyy: '', //合同中止原因 ,
                id: '', // id ,
                jmje: '', //减免金额 ,
                jmyy: '', //减免原因 ,
                lxdh: '', //联系电话 ,
                lxdz: '', //联系地址 ,
                ndgrf: '', //年度供热费 ,
                pageSize: 10, //每页数量 ,
                qdsj: '', //合同签订时间 ,
                qtpt: '', //其他配套 ,
                relid: '', //关联ID ,
                rqb: '', //燃气表 ,
                rzfj: '', //入住附件 ,
                sbqd: '', //设备清单 ,
                sbqk: '', //设施设备情况 ,
                shb: '', //水表 ,
                status_code: 1, //1正常 2删除 ,
                stdwid: '', //受托单位ID ,
                type: this.$store.getters.type, //分类 ,
                update_name: '', //修改人 ,
                update_name_id: '', //修改人id ,
                update_time: '', //修改时间 ,
                wyf: '', //物业费 ,
                yj: '', //押金 ,
                yjrq: '', //押金收缴日期 ,
                ysje: '', //预收金额 ,
                zjdj: '', //租金单价 ,
                zjhm: '', //证件号码 ,
                zjmc: '', //证件名称 ,
                zldqsj: '', //租赁到期时间（提前中止修改） ,
                zlqssj: '', //租赁起始时间 ,
                zlqx: '', //租赁期限 ,
                zlyt: '', //租赁用途 ,
                zsje: '' //增收金额
            }
        };
    },
    methods: {
        // 判断补旧欠金额大小
        bjqpd() {
            if (this.bjdetail.jqje < this.tjdetail.bjqje) {
                this.tjdetail.bjqje = this.bjdetail.jqje;
            }
        },
        // 列表样式
        tableHeaderColor({ row, column, rowIndex, columnIndex }) {
            if (rowIndex === 0) {
                return 'background-color: #f7f7f7;color:black;height: 54px;font-weight: 500;font-size:14px;font-variant:tabular-nums';
            }
        },
        tablerowColor({ row, rowIndex }) {
            return 'height: 42px;font-size:14px;';
        },
        // 获取税额
        getseval() {
            // 网上找的计算方法
            // 税前金额 除以 (1+9%)的 商再乘以9% 可以得到税额
            // 税前金额 除以 (1+9%)的 商 为税后金额
            this.projectdetail.she = ((this.projectdetail.sqje / 1.09) * 0.09).toFixed(2);
            this.projectdetail.shje = (this.projectdetail.sqje / 1.09).toFixed(2);
        },
        // 月份划分(列表数据计算)
        gettime(zje, myje, yjqt, dqje, jyjje, zsje) {
            var that = this;
            let zjeqs = zje - (Number(yjqt) + Number(dqje) + Number(jyjje) + Number(zsje)); //获取总金额
            let changetable = []; //获取到新数组
            // 交钱交少了还是只会少交和刚刚好交
            for (let i = 0; i < this.tableData.length; i++) {
                // 交款金额 小于 应缴金额时
                // 当 应缴金额 小于 税前总金额-前一条应缴金额 时 交款金额等于应缴金额
                // 交款金额 大于 应缴金额时 交款金额 等于 循环减去应缴金额的税前总金额
                console.log(that.tableData);
                if (that.tableData[i].jkje <= that.tableData[i].yjje) {
                    console.log('小于总金额');
                    if (that.tableData[i].yjje <= zjeqs) {
                        that.tableData[i].jkje = that.tableData[i].yjje.toFixed(2);
                        console.log(that.tableData[i].jkje);
                        zjeqs = zjeqs - that.tableData[i].jkje;
                        changetable.push(that.tableData[i]);
                        that.newtable = changetable;
                        console.log('changetable', changetable);
                        this.showtj = false;
                    } else {
                        console.log('zjeqs', zjeqs);
                        that.tableData[i].jkje = parseFloat(zjeqs).toFixed(2);
                        changetable.push(that.tableData[i]);
                        that.newtable = changetable;
                        this.showtj = false;
                        return;
                    }
                } else {
                    console.log(132465789);
                }
            }
        },
        // 取消
        cacelsubmitForm() {
            this.$router.go(-1);
        },
        // 获取交付款值
        getjfkvalue(value) {
            console.log(value);
            if (value == '2') {
                this.jkshowname = '返款';
                this.jksjow = false;
            } else {
                this.jkshowname = '交款';
                this.jksjow = true;
            }
        },
        // 租金交款详情页
        async getjfxq(data) {
            await getjfxq(data).then((res) => {
                this.bjdetail = res.data;
                this.buildvalue = res.data.buildinfo;
                this.form = res.data.signInfo;
                this.jftabledata = res.data.jfList;
                this.tableData = res.data.ndzjList;
                this.bjdetail.wjyjje = parseFloat(this.form.yj) - parseFloat(this.bjdetail.yjyjje);
            });
        },
        // 委托运营详情
        jygldetail(data) {
            jygldetail(data).then((res) => {
                this.form = res.data;
                this.fromlist = res.data.fj;
                console.log(this.form.fj);
            });
        },
        // 楼幢详情
        builddetail(data) {
            builddetail(data).then((res) => {
                this.buildvalue = res.data;
            });
        },
        // 合同详情
        signlistdetail(data) {
            signlistdetail(data).then((res) => {
                this.form = res.data;
                this.sbqd = this.form.sbqd.split(',');
            });
        },
        // 合同详情租金列表
        jfzjlist(data) {
            jfzjlist(data).then((res) => {
                this.tableData = res.data.records;
            });
        },

        // 新增缴费信息
        jfxzadd(data) {
            jfxzadd(data).then((res) => {
                console.log(res);
            });
        },
        // 缴费租金列表
        jflist(data) {
            jflist(data).then((res) => {
                this.jftabledata = res.data.records;
                this.total = res.data.total;
            });
        },

        // 新增租金信息
        xzzjupdate(data) {
            xzzjupdate(data).then((res) => {
                console.log(res);
            });
        },
        // 缴费信息提交(提交信息和列表)
        updatezjjfinfo(data) {
            updatezjjfinfo(data).then((res) => {
                if (res.code == 200) {
                    // 缴费信息提交后刷新俩列表
                    // let zjdata = {
                    //     signid: this.signid
                    // }
                    // this.jfzjlist(zjdata)
                    // this.current = 1;
                    // this.jflistform.current = 1;
                    // this.jflist(this.jflistform)
                    this.getjfxq(this.signid);
                    this.projectdetail = {
                        jfk: '1', //交返款 1：交款 2：返款 ,
                        she: 0, //税额
                        shje: 0, //税后金额
                        sqje: 0, //税前金额
                        zjlb: '', //收租方式
                        zph: '', //支票号
                        jkrq: '', //交款日期
                        bz: '', //备注
                        status_code: 1,
                        jyjje: 0, //缴押金金额
                        tkje: 0, //退款金额
                        zjList: []
                    };
                    this.getNowDate();
                    this.tjdetail.bjqje = 0;
                    this.tjdetail.jqtje = 0;
                    this.tjdetail.jyjje = 0;
                    this.tjdetail.zsje = 0;
                    this.showtj = true;
                    // location.reload()
                } else {
                    this.$message.error('操作错误，请核对数据！！');
                }
                console.log(res);
            });
        },
        //保存按钮
        submittwojk() {
            var that = this;
            if (this.projectdetail.zjlb) {
                this.projectdetail.signid = this.signid;
                if(that.newtable.length==0){
                    that.newtable=that.tableData
                }
                console.log('123456',that.newtable);
                // 算上交的总金额 判断修改后的总额是否大于税前金额
                let zongnum = 0;
                for (var i = 0; i < that.newtable.length; i++) {
                    that.newtable[i].jkje?that.newtable[i].jkje=that.newtable[i].jkje:that.newtable[i].jkje=0
                    zongnum = zongnum + parseFloat(that.newtable[i].jkje);
                }
                console.log('zongnum', zongnum);
                console.log('sqje', Number(that.projectdetail.sqje) + Number(0.1));
                let jbjje =
                    Number(zongnum) +
                    Number(that.tjdetail.bjqje) +
                    Number(that.tjdetail.jqtje) +
                    Number(that.tjdetail.jyjje) +
                    Number(that.tjdetail.zsje);
                // 减去俩值得到的新值（本次补缴旧欠金额，已缴其他金额）
                if (jbjje <= Number(that.projectdetail.sqje) + Number(0.1)) {
                    that.projectdetail.zjList = that.newtable;
                    that.projectdetail.bjqje = that.tjdetail.bjqje ? that.tjdetail.bjqje : 0;
                    that.projectdetail.jqtje = that.tjdetail.jqtje ? that.tjdetail.jqtje : 0;
                    that.projectdetail.jyjje = that.tjdetail.jyjje ? that.tjdetail.jyjje : 0;
                    that.projectdetail.zsje = that.tjdetail.zsje ? that.tjdetail.zsje : 0;
                    console.log('projectdetail', that.projectdetail);
                    that.updatezjjfinfo(that.projectdetail);
                } else {
                    that.$message.error('交款总额不能大于税前金额，请核对');
                }
            } else {
                that.$message.error(`请选择${this.jksjow ? '收租' : '返款'}方式`);
            }
        },
        //保存按钮
        submittwojk1() {
            var that = this;
            if (this.projectdetail.zjlb) {
                this.projectdetail.signid = this.signid;
                that.updatezjjfinfo(that.projectdetail);
            } else {
                that.$message.error(`请选择${this.jksjow ? '收租' : '返款'}方式`);
            }
        },
        yzysubmit() {
            let data = {
                current: 0,
                pageSize: 0,
                signlist: [{ id: this.signid }]
            };
            // 预转已接口
            yzyinfo(data).then((res) => {
                if (res.code == 200) {
                    this.$message.success('提交成功');
                    // 预转已提交后刷新俩列表
                    // let zjdata = {
                    //     signid: this.signid
                    // }
                    // this.jfzjlist(zjdata)
                    // this.current = 1;
                    // this.jflistform.current = 1;
                    // this.jflist(this.jflistform)
                    // 总的详情页
                    this.getjfxq(this.signid);
                }
            });
        },
        // 获取当前年月日
        getNowDate() {
            var now = new Date();
            var year = now.getFullYear(); //得到年份
            var month = now.getMonth(); //得到月份
            var date = now.getDate(); //得到日期
            var hour = ' 00:00:00'; //默认时分秒 如果传给后台的格式为年月日时分秒，就需要加这个，如若不需要，此行可忽略
            month = month + 1;
            month = month.toString().padStart(2, '0');
            date = date.toString().padStart(2, '0');
            this.projectdetail.jkrq = `${year}-${month}-${date}`;
        },
        // 搜索
        onSearch() {
            this.current = 1;
            this.fwform.current = 1;
            this.getzssignlist(this.fwform);
            console.log('搜索');
        },
        // 重置
        reSearch() {
            this.current = 1;
            this.pageSize = 10;
            this.fwform = {
                create_name: '', // 创建人 ,
                create_name_id: '', // 创建人id ,
                create_time: '', // 创建时间 ,
                current: 1, //第几页,
                czdz: '', //出租地址 ,
                czmj: '', //出租面积 ,
                czr: '', //承租人 ,
                czrlxfs: '', //承租人联系方式 ,
                dabh: '', //档案编号 ,
                db: '', //电表 ,
                fgy: '', //房管员 ,
                fj: '', //附件 ,
                fwdz: '', //房屋地址 ,
                glfs: '', //管理方式 出租经营 委托管理 ,
                htbh: '', //合同编号 ,
                htdqsj: '', //合同到期时间（签订时约定时间） ,
                htje: '', //合同金额 ,
                htzzsj: '', //合同中止时间 ,
                htzzyy: '', //合同中止原因 ,
                id: '', // id ,
                jmje: '', //减免金额 ,
                jmyy: '', //减免原因 ,
                lxdh: '', //联系电话 ,
                lxdz: '', //联系地址 ,
                ndgrf: '', //年度供热费 ,
                pageSize: 10, //每页数量 ,
                qdsj: '', //合同签订时间 ,
                qtpt: '', //其他配套 ,
                relid: '', //关联ID ,
                rqb: '', //燃气表 ,
                rzfj: '', //入住附件 ,
                sbqd: '', //设备清单 ,
                sbqk: '', //设施设备情况 ,
                shb: '', //水表 ,
                status_code: 1, //1正常 2删除 ,
                stdwid: '', //受托单位ID ,
                type: this.$store.getters.type, //分类 ,
                update_name: '', //修改人 ,
                update_name_id: '', //修改人id ,
                update_time: '', //修改时间 ,
                wyf: '', //物业费 ,
                yj: '', //押金 ,
                yjrq: '', //押金收缴日期 ,
                ysje: '', //预收金额 ,
                zjdj: '', //租金单价 ,
                zjhm: '', //证件号码 ,
                zjmc: '', //证件名称 ,
                zldqsj: '', //租赁到期时间（提前中止修改） ,
                zlqssj: '', //租赁起始时间 ,
                zlqx: '', //租赁期限 ,
                zlyt: '', //租赁用途 ,
                zsje: '' //增收金额
            };
            this.getzssignlist(this.fwform);
            console.log('搜索');
        },
        // 换页
        handleCurrentChange(val) {
            this.current = val;
            this.fwform.current = val;
            this.getzssignlist(this.fwform);
            console.log(val);
        },
        // 每页条数
        handleSizeChange(val) {
            this.current = 1;
            this.pageSize = val;
            this.fwform.pageSize = val;
            this.getzssignlist(this.fwform);
            console.log(val);
        },
        // 项目列表
        getzssignlist(data) {
            getzssignlist(data).then((res) => {
                if (res.code == 200) {
                    this.zstableData = res.data.records;
                    this.total = res.data.total;
                } else {
                    this.zstableData = [];
                    this.total = 0;
                }
            });
        },
        // 选中
        getzsClick(val) {
            this.$confirm('确定增收转入这条数据吗？')
                .then(() => {
                    let data = {
                        zszchtid: val,
                        zszrhtid: this.signid
                    };
                    updatezzy(data).then((res) => {
                        if (res.code == 200) {
                            this.addzs = false;
                            this.getjfxq(this.signid);
                        }
                    });
                })
                .catch(() => {
                    this.$message.success('取消');
                });
        }
    },
    created() {
        this.signid = this.$route.query.signid;
        this.getjfxq(this.signid);
        console.log(this.$route.query);
        this.getNowDate();
        this.getzssignlist(this.fwform);
        // let data = {
        //     id: this.$route.params.id
        // };
        // this.builddetail(data);
        // let htdata = {
        //     id: this.$route.params.signid
        // }
        // this.signlistdetail(htdata)
        // let zjdata = {
        //     signid: this.$route.params.signid,
        // }
        // this.jfzjlist(zjdata)
        // console.log('params', this.$route.params)
        // 缴费列表
        // this.jflistform.signid = this.$route.params.signid
        // this.jflist(this.jflistform)
    }
};
</script>
<style>
.el-upload-list {
    width: 60%;
}

.el-upload--text {
    width: auto;
    height: 80px;
    overflow: hidden;
    border: none;
}
</style>
<style scoped>
.container {
    overflow: hidden;
}

.crumbs {
    background-color: #fff;
    padding: 20px 20px;
}

.indexTitle {
    margin-bottom: 20px;
}

.contentbox {
    display: flex;
    justify-content: space-between;
}

.contentsize {
    font-size: 18px;
    font-weight: 700;
    line-height: 32px;
    color: #606266;
}

.handle-box {
    overflow: hidden;
}

.addtitle {
    width: 100%;
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 20px;
    box-sizing: border-box;
    margin-bottom: 20px;
    font-weight: 700;
}

.buttonCenter {
    width: 12%;
    margin: auto;
}

.unloadTitle {
    text-align: left;
    padding-bottom: 10px;
    box-sizing: border-box;
    color: #606266;
}

/* 搜索按钮 */
.searchcolor {
    background-color: #7090ff;
}

.detailcontent {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.detailcontent .detailitem {
    /* float: left; */
    width: 33%;
    margin-bottom: 30px;
}

.detailcontent .detailitem1 {
    /* float: left; */
    width: 99%;
    margin-bottom: 30px;
    font-weight: 700;
    color: #008a94;
}

.detailcontent .detailitem2 {
    /* float: left; */
    width: 99%;
    margin-bottom: 30px;
}

/* 项目文件 */
.filebox {
    text-align: center;
    margin-right: 10px;
    cursor: pointer;
}

.fileboxitem:hover {
    color: #7090ff;
}

.deleteitem {
    color: red;
}

.deleteitem:hover {
    color: #eeeeee;
}
</style>